<template>
  <div>

    <f-table ref="table" size="small" rowKey="processId" :showSetting="true" setting-key='ordertask'  :tableColumns="columns"  :scroll="{x:true}"  :multiple="false" :operator="operator" :params="queryParam" :api="api.tasktodo" handler="orderTaskTodoListHandler">
         <span slot="supplierBondType" slot-scope="text, record, index">
            <a-tag color="#2db7f5" v-if="text==0">不垫付</a-tag>
            <a-tag color="purple" v-if="text==1">底价</a-tag>
            <a-tag color="purple" v-if="text==2">底价+税金</a-tag>
            <a-tag color="purple" v-if="text==3">税金</a-tag>
            <a-tag color="purple" v-if="text==6">底价/2+税金</a-tag>
            <a-tag color="purple" v-if="text==5">全额垫付</a-tag>
            <a-tag color="purple" v-if="text==8">销售金额*费率</a-tag>
        </span>

      <span slot="customBondType" slot-scope="text, record, index">
           <a-tag color="#2db7f5" v-if="text==0">全款</a-tag>
            <a-tag color="purple" v-if="text==1">底价</a-tag>
            <a-tag color="purple" v-if="text==2">底价+税金</a-tag>
            <a-tag color="purple" v-if="text==6">底价/2+税金</a-tag>
            <a-tag color="purple" v-if="text==3">税金</a-tag>
            <a-tag color="purple" v-if="text==5">全额资信</a-tag>
            <a-tag color="purple" v-if="text==7">预付款</a-tag>
        </span>
      <span slot="orderType" slot-scope="text, record, index">
           <a-tag color="#2db7f5" v-if="text==1">销售</a-tag>
            <a-tag color="red" v-if="text==2">退货</a-tag>
            <a-tag color="purple" v-if="text==3">补货</a-tag>
        </span>
      <span slot="action" slot-scope="text, record">
          <template>
            <a v-if="record.endTime==''&&record.assignee!=''&& record.assignee!=''" @click="$refs.drawer.showDrawer(record)">办理</a>
            <a v-if="record.assignee==''||record.assignee==''" @click="claimTask(record)">认领</a>
             <a-divider type="vertical"/>
             <a @click="$refs.orderInfoDrawer.showDrawer(record)" >查看</a>
            <a-divider type="vertical"/>
          </template>
          <a-dropdown>
            <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
            <a-menu slot="overlay">
               <a-menu-item v-if="record.assignee===$store.getters.userInfo.nickName && record.endTime==''">
                <a href="javascript:;" @click="unClaimTask(record)">取消认领</a>
              </a-menu-item>
                <a-menu-item>
                <a href="javascript:;" @click="processImg(record)">审批进度</a>
              </a-menu-item>
              <a-menu-item v-if='superAdmin'>
                <a href="javascript:;" @click="deleteProcessInstance(record)">删除流程实例</a>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
        </span>
    </f-table>
    <task-todo-drawer ref="drawer" @success="onLoad" taskHandlerName="orderTaskDataHandler"></task-todo-drawer>
    <process-image ref="processImg" v-if="processImageVisible" :visible.sync="processImageVisible" :processInstanceId="processInstanceId"></process-image>
   <order-info-drawer ref="orderInfoDrawer" :read-only="true"></order-info-drawer>

  </div>
</template>
<script>

  import api from './js/api'
  import TaskTodoDrawer from './tasktodo_drawer'
  import ProcessImage from '../process/process_image'
  import OrderInfoDrawer from '../../business/order/order_info_drawer'


  export default {
    name: 'TodoNo',
    components: {
      OrderInfoDrawer,

      ProcessImage,
      TaskTodoDrawer
    },
    data() {
      let me = this
      //操作按钮
      let operator = []

      return {
        api: Object.assign(api, this.api),
        //列表初始化查询参数
        queryParam: {},
        processInstanceId: '',
        superAdmin: this.superAdmin,
        processImageVisible: false,
        // 表头
        columns: [
          {
            title: '操作',
            align: 'center',
            width: '150px',
            fixed: 'left',
            scopedSlots: { customRender: 'action' }
          },
          {
            title: '单号',
            align: 'center',
            fixed: 'left',
            width: '130px',
            dataIndex: 'orderNo'
          },
          {
            title: '订单类型',
            width: '70px',
            align: 'center',
            dataIndex: 'orderType',
            scopedSlots: { customRender: 'orderType' }
          },
          {
            title: '订单状态',
            width: '120px',
            align: 'center',
            dataIndex: 'taskName'
          },
          {
            title: '发货日期',
            align: 'center',
            width: '120px',
            dataIndex: 'sendDate'
          },

          {
            title: '部门',
            align: 'center',
            width: '120px',
            dataIndex: 'deptName'
          },
          {
            title: '负责人',
            align: 'center',
            width: '120px',
            dataIndex: 'saleManName'
          },
          {
            title: '供货方',
            align: 'center',
            ellipsis: true,
            width: '120px',
            dataIndex: 'supplierName'
          },
          {
            title: '供方资信',
            align: 'center',
            width: '100px',
            dataIndex: 'supplierBondType',
            scopedSlots: { customRender: 'supplierBondType' }
          },
          {
            title: '购货方',
            align: 'center',
            ellipsis: true,
            width: '120px',
            dataIndex: 'customName'
          },
          {
            title: '购方资信',
            align: 'center',
            width: '100px',
            dataIndex: 'customBondType',
            scopedSlots: { customRender: 'customBondType' }
          },
          {
            title: '收款金额',
            align: 'center',
            width: '90px',
            dataIndex: 'takeAmount'
          },
          {
            title: '发货金额',
            align: 'left',
            width: '90px',
            dataIndex: 'saleAmount'
          },
          {
            title: '数量',
            align: 'left',
            width: '70px',
            dataIndex: 'saleNum'
          },
          {
            title: '规格',
            align: 'left',
            width: '80px',
            dataIndex: 'drugsSpec'
          },
          {
            title: '收款日期',
            align: 'center',
            width: '120px',
            dataIndex: 'takeDate'
          },
          {
            title: '制单人',
            align: 'center',
            width: '120px',
            dataIndex: 'nickName'
          },
          {
            title: '创建日期',
            align: 'center',
            width: '150px',
            dataIndex: 'createTime'
          }
        ],
        operator: operator
      }
    },
    created() {
    },
    methods: {
      onLoad() {
        this.$refs.table.refresh()
      },
      claimTask(task) {
        this.http.put(this, {
          url: this.api.tasktodo.claim,
          data: {
            taskId: task.taskId
          },
          success(me, data) {
            me.$refs['table'].refresh(false)
          }
        })
      },
      deleteProcessInstance(task) {
        this.http.confirm(this, {
          content: '确认删除吗?',
          url: api.processInstance.remove,
          data: {
            ids: task.processInstanceId,
            cascade:true
          },
          success: function(me, data) {
            me.$refs['table'].refresh(false)
          }
        })
      },
      processImg(task) {
        this.processInstanceId = task.processInstanceId
        this.processImageVisible = true
      },
      /**
       * 查询事件
       * @param searchParams
       */
      searchTable(searchParams) {
        this.queryParam = Object.assign(this.queryParam, searchParams)
        this.$refs.table.refresh(true, searchParams)
      },
      unClaimTask(task) {
        this.http.put(this, {
          url: this.api.tasktodo.unclaim,
          data: {
            taskId: task.taskId
          },
          success(me, data) {
            me.$refs['table'].refresh(false)
          }
        })
      }
    }
  }
</script>
